<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <link rel="stylesheet" href="../css/login.css">
    <link rel="stylesheet" href="../css/lndex.css">
    <script src="../js/axios.min.js"></script>
</head>
<body>
    <div class="main">
        <div class="main-close"></div>
        <div class="main-content">
            <div class="content-left">
                <div class="left-main">
                    <div class="left-code">
                        <div class="code-download">
                            <p>扫码下载客户端</p>
                        </div>
                    </div>
                    <div class="left-text">
                        <p class="left-text-p1">请使用
                            <a href="https://app.bilibili.com/" target="_blank">哔哩哔哩客户端</a>
                        </p>
                        <p class="left-text-p2">扫码登录或者扫码下载</p>
                    </div>
                </div>
            </div>
            <div class="content-middle"></div>
            <div class="content-right">
                <div class="right-header">
                    <span class="right-password">密码登录</span>
                    <span class="right-middle"></span>
                    <span class="right-message">短信登录</span>
                </div>
                <div class="right-main">
                    <div class="main-account">
                        <span class="account-text">账号</span>
                        <input type="text"  class="account-ipt" id="username" placeholder="请输入账号">
                    </div>
                    <div class="main-account">
                        <span class="account-text">密码</span>
                        <input type="text"  class="account-ipt" id="password" placeholder="请输入密码">
                    </div>
                    <div class="main-login-register">
                        <div class="register"><a href="../html/register.html" style="text-decoration: none; color:black">注册</a></div>
                        <div class="login"><button id="btn" style="width: 193.5px;height:40px;background-color: #00a1d6;color: #fff;border: none; cursor: pointer;">登录</button></div>
                    </div>
                    <div class="main-footer">
                        <div class="mian-footer-title">其他登录方式</div>
                        <div class="another-img">
                            <span class="img-wechat">
                                <span class="wechat"></span>
                                微信登录
                            </span>
                            <span class="img-weibo">
                                <span class="weibo"></span>
                                微博登录
                            </span>
                            <span class="img-qq">
                                <span class="qq"></span>
                                QQ登录
                            </span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="agreement">
            <div>
                <p class="agreement-main-p1">未注册过哔哩哔哩的手机号，我们将自动帮您注册账号</p>
                <p class="agreement-main-p2">
                    登录或完成注册即代表您同意 "
                    <a href="https://www.bilibili.com/protocal/licence.html" target="_blank" class="p2-a1">用户协议</a>
                    "和"
                    <a href="https://www.bilibili.com/blackboard/privacy-pc.html" target="_blank" class="p2-a2">隐私政策 "</a>
                </p>
            </div>
        </div>
    </div>
    <script>
        let ipt1=document.querySelector("#username");
        let ipt2=document.querySelector("#password");
        btn.onclick=function(evt){
            let username=ipt1.value;
            let password=ipt2.value;
            let loginAPI="http://jx.xuzhixiang.top/ap/api/login.php";
            let p = axios.get(loginAPI, {
                params: {username, password},
            });
            p.then((r)=>{
                console.log(r.data);
                if(r.data.code==0){
                    alert(r.data.msg);
                }else{
                    alert(r.data.msg);
                    console.log(r.data.data.id);
                    //存入本地
                    localStorage.setItem("id", r.data.data.id);
                    localStorage.setItem("loginId", r.data.data.id);
                    localStorage.setItem("token", r.data.data.token);
                    localStorage.setItem("loginToken", r.data.data.token);
                    location.href="../index.html";
                }
            });
            evt.preventDefault();
        }
    </script>
</body>
</html>